import React from 'react';
import { Row, Input,Button } from 'antd';
import './login.css'
import Ontrial from './Ontrial'
import {smsList} from '../../redux/login/login'
import {forgets} from '../../redux/login/login'
import { connect } from 'react-redux'
import {withRouter } from 'react-router-dom'
const Search = Input.Search;
@withRouter
@connect(
    state => state,
    { smsList,forgets }
)
export default class ForgetPassword extends React.Component{
    constructor(){
        super();
        this.state = {
            visible : false,
            code:60,
            codestate:false
        }
    }
    componentWillReceiveProps(){
         console.log(this.props)
        if(this.props.userLogin.forgetState){
            this.props.history.push('/login/1')
        }else{

        }
    }

    forgetBtn(){
        let forgetIPhone = document.getElementById('forgetIPhone').value
        let password1 = document.getElementById('password1').value
        let password2 = document.getElementById('password2').value
        this.props.forgets(forgetIPhone,'8658',password1)
    }
    forgetpw(){
        let forgetIPhone = document.getElementById('forgetIPhone').value
        this.props.smsList(forgetIPhone);
        if(this.state.code === 60){
            console.log('获取验证码')
        let identTime = setInterval(()=>{
            if(this.state.code > 1){
                this.setState({
                    code:this.state.code - 1,
                    codestate:true
                })
            }else{
                console.log(this.state.code)
                this.setState({
                    code:60,
                    codestate:false
                })
                clearInterval(identTime);
            }
           
        },1000)
      }
    }
    render() {
        return (
            <div className='login'>
                 <div >
                    <Input id='forgetIPhone' className='iPhone' style={{height:'40px'}} placeholder="请输入手机号" />
                    <Search
                        style={{paddingTop:'20px'}}
                        placeholder="验证码"
                        enterButton= {this.state.codestate ? this.state.code+'秒' :'获取验证码'}
                        size="large"
                        onSearch={this.forgetpw.bind(this)}
                    />
                    <Input id='password1' className='password' style={{height:'40px'}} placeholder="请输入新密码" />
                    <Input id='password2' className='password' style={{height:'40px'}} placeholder="确认新密码" />
                    <Button className='btnPrimary' onClick={this.forgetBtn.bind(this)} style={{height:'40px'}} type="primary" block>立即修改</Button>
                 </div>
            </div>
        )
    }
}